<template>
  <div class="profile-container profile__bg">
    <div class="profile" >
        <div class="profile__avatar">
            <image src="https://cdnbdimg.tatagou.com.cn/20160811-57abe78f106ed.jpg"/>
        </div>
    </div>
  </div>
</template>

<script>
export default {
    data(){
        return {
        }
    },
    props: ['userInfo'],
    computed: {
    },
  methods: {
  }
}
</script>
<style scoped>

.profile-container {
    padding: 0 .3rem;
    margin-bottom: .3rem;
    background-color: #f7f7f7;
    color: #ffffff;
}

.profile__bg {
    background-size: 7.5rem 2.32rem;
}

.profile {
    display: flex;
    padding: .3rem 0;
}

.profile__tip {
    font-size:.20rem;
    color:rgba(255,255,255,1);
}

.profile__avatar {
    height: 1.09rem;
    width: 1.09rem;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 .2rem 0 .1rem;
}

.profile__avatar image{
    border-radius: 50%;
    width: 100%;
    height: 100%;
}

.profile__account-name {
    font-size:.34rem;
}

.profile-name-level {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding: .14rem 0;
}

.profile-level {
    height:.34rem;
    background:rgba(32,52,35,.27);
    border-radius: .17rem ;
    font-size:.20rem;
    color: #ffffff;
    /* text-align: center; */
    display: flex;
}

.profile__level {
    margin: 0 .2rem 0 .1rem;
}

.profile__level-icon {
    height: .34rem;
    width: .34rem;
}

.balance__line {
    width: .01rem;
    height: .8rem;;
    background: #ffffff;
}

.balance {
    display: flex;
    align-items: center;
    text-align: center;
    padding: .3rem 0;
    background:#ffffff;
    border-radius: .1rem;
}

.balance-item__title {
    font-size:.22rem;
    color:rgba(156,156,156,1);
}

.balance-item__amount {
   font-size:.34rem;
}

.balance-item {
    flex: 1;
    display: flex;
    justify-content: center;
    border-left: 1px solid rgba(0, 0, 0, .1);
}

.balance-item__first{
    border-left: none;
}

.new-user {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background:rgba(255,255,255,1);
}
.new__gift {
    height: 1.23rem;
    width: 1.45rem;
}

.new__gift image {
    height: 100%;
    width: 100%;
}
.title {
    margin: .2rem 0;
}
.new__title {
    font-size:.36rem;
    color:rgba(50,50,50,1);
    line-height:.50rem;
}
.new__title_orange {
    color: #FB8200;
}

.new__sub-title {
    font-size:.24rem;
    line-height:.33rem;
}
</style>
